<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.js"></script>
</head>
<body>
	<input type="text" id="keyWord"> </input>

	<div id="mydiv">
 
	  <!-- 下面是内容展示的区域 -->
	  <div id="popDiv">
		   <table id="contentTable" bgcolor="#FFFAFA" border="0" cellpadding="0" cellspacing="0">
			    <tbody id="content_table_body">
			    <!-- 这个是动态查询出来的数据显示的地方 -->
			    
			    
			    </tbody>
			   </table>
		  </div>
	 </div>


	<script type="text/javascript">
		$(function(){
			$("#keyWord").on("keyup", function(){
				var key = {key:$("#keyWord").val()};
				$.ajax({
					type:"POST",
					url:"http://127.0.0.1:9000/ajax/loadAreas",
					data:key
					
				}).done(function(data){
					var result = JSON.parse(data);
					var table = $("#content_table_body");
					table.empty();
					
					for (let i = 0; i < result.length; i++) {
						 var tr = $("<tr></tr>");
						 table.append(tr.append("<td></td>").text(result[i].area));

					}
				});
			});
		});

	</script>
</body>
</html>